<template>
    <div id="tmpl">
        <mt-header fixed title="Vue商城系统">
			<router-link to="/photo/photolist" slot="left">
				<mt-button icon="back">返回</mt-button>
			</router-link>
			 <mt-button icon="more" slot="right"></mt-button> 
		</mt-header>
        <div id="desc">
            <!--图片详情  -->
            <div class="title">
                <h4>图片详情</h4>
                <p>{{photoinfo.add_time | datefmt('YYYY-MM-DD')}} {{photoinfo.click}}次浏览</p>
                <p class="line"></p>
            </div>
            <!--图片缩略图  -->
            <div class="mui-content">
				<ul class="mui-table-view mui-grid-view mui-grid-9">
					<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
						<router-link to="/news/newslist">
							<span class="mui-icon mui-icon-home"></span>
						</router-link>
					</li>

					

				</ul>
            </div>   
            <!--图片详情- 摘要部分-->
           	<p v-html="photoinfo.content"></p>
        </div>
        <!--加载评论  -->
        <comment :msg="id"></comment>
    </div>
</template>

 <script type="text/ecmascript-6">
import { Toast } from 'mint-ui'
import common from '../../kits/common.js'
import comment from '../subcom/comment.vue'//引入子组件
export default {
    components: {
        comment: comment
    },
    data() {
        return {
            id: 0,
            photoinfo:[]
        }

    },
    created() {
        this.id = this.$route.params.id;
        this.getinfo()
    },
    methods: {
        getinfo(){
            var url = common.apidomain + "/api/getimageInfo/" + this.id
            this.$http.get(url).then(function (response) {
                var body = response.body;
                console.log(body);
                this.photoinfo = body.message[0]
            })
        }
    }
}
</script>

<style scoped >
#desc {
    padding: 10px;
}

#desc .title h4 {
    color: #0094ff;
}

#desc .title p {
    color: rgba(0, 0, 0, 0.4);
    margin-top: 10px;
}

#desc .title .line {
    width: 100%;
    height: 1px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
}
</style>
